<!--
 * @Author: quit
 * @Date: 2021-11-12 17:59:11
 * @LastEditTime: 2021-12-02 13:30:52
 * @Descripttion: 项目主页
-->

<template>
  <div id="home">FdaHome</div>
</template>

<script>
export default {
  components: {},
  data() {
    return {}
  },
  // 监听属性 类似于data概念
  computed: {},
  // 监控data中的数据变化
  watch: {},
  created() {}, // 生命周期 - 创建完成（可以访问当前this实例）
  mounted() {}, // 生命周期 - 挂载完成（可以访问DOM元素）
  beforeCreate() {}, // 生命周期 - 创建之前
  beforeMount() {}, // 生命周期 - 挂载之前
  beforeUpdate() {}, // 生命周期 - 更新之前
  updated() {}, // 生命周期 - 更新之后
  beforeDestroy() {}, // 生命周期 - 销毁之前
  destroyed() {}, // 生命周期 - 销毁完成
  activated() {}, // 如果页面有keep-alive缓存功能，这个函数会触发
  // 方法集合
  methods: {}
}
</script>

<style lang="scss" scoped>
#home {
  height: 100%;
  width: 100%;
  .home-container {
    height: 100%;
    width: 100%;
    .el-header {
      width: 100%;
      height: 100px !important;
      background-color: #373d41;
      display: flex;
      flex-direction: column;
      .top-item {
        height: 60px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .left-item {
          .logo {
            width: 60px;
            height: 60px;
            img {
              width: 100%;
              height: 100%;
            }
          }
        }
        .conenter-item {
          .header-test {
            font-size: 28px;
            color: #fff;
            line-height: 60px;
          }
        }
      }
      .buttom-item {
        height: 40px;
      }
    }
    .el-main {
      background-color: #e4e4e4;
    }
  }
}
</style>
